var app = getApp()

Component({
  data: {
    top: 40,
    width: 100,
    height: 30,
    // 显示和隐藏状态
    show: true,
    btnImg: "https://assets.mhblog.cn/mhblog/icon/eye-show.png",
  },
  properties: {
    // 胶囊背景 dark.深色 white.白色
    bg: {
      type: String,
      value: 'white'
    },
  },

  ready() {
    // 系统屏幕位置信息
    const systemInfo = wx.getSystemInfoSync()
    // console.log('systemInfo', systemInfo)

    // 胶囊位置信息
    const menuButtonInfo = wx.getMenuButtonBoundingClientRect()
    // console.log('menuButtonInfo', menuButtonInfo)

    // 单位间距（胶囊距屏幕右侧的距离）
    const dp = systemInfo.screenWidth - menuButtonInfo.right
    this.setData({
      dp,
    })

    // 胶囊位置
    this.setData(Object.assign(this.data, menuButtonInfo))
  },

  // ##########################################################################################

  methods: {

    // 显示和隐藏切换
    onTriggle() {
      if (this.data.show) {
        this.setData({
          show: false,
          btnImg: 'https://assets.mhblog.cn/mhblog/icon/eye-hide.png',
          bg: 'dark',
        })
      } else {
        this.setData({
          show: true,
          btnImg: 'https://assets.mhblog.cn/mhblog/icon/eye-show.png',
          bg: 'white',
        })
      }
      //发送一个事件
      this.triggerEvent("optshow", this.data.show)
    },

  }

  // ##########################################################################################

})